// useEffect影响钩子  副作用钩子
import React ,{useEffect,useState} from 'react'

function App() {
    const [count,setCount] = useState(0)
    const [width,setWidth] = useState(document.body.clientWidth)
    // 改变页面宽度的函数方法
    const onChange =()=>{
        setWidth(document.body.clientWidth)
    }
    // 点击+函数
    const add1 =()=>{
        setCount(count+11)
    }
    // 影响钩子 用来取代生命周期
    useEffect(()=>{
       console.log('2 影响')
        window.addEventListener('resize',onChange,false)
        // 销毁后会自动执行这个return 
        return ()=>{
            console.log('销毁')
            window.removeEventListener('resize',onChange,false)
        }

    },[count])

 

    return (
        <div>
            页面count {count} 
            页面宽度:{width}
            <button onClick={add1}>点击+</button>
        </div>
    )
}


export default App

